<template>

	<!-- 自定义navbar组件【放在窗体外部，否则被content占据间距】 -->
	<CustomNavbar navTitle='商品分类' :isTitleStyle="true"></CustomNavbar>

	<!-- <button type="primary" @tap="multiple = !multiple">切换单、多选：{{multiple?'多选':'单选'}}</button>
	<button type="primary" @tap="flod = !flod">折叠已打开的子集：{{flod?'折叠':'不折叠'}}</button>
	<button type="primary" @tap="selectParent = !selectParent">切换父级可选：{{selectParent?'可选':'不可选'}}</button>
	<button type="primary" @tap="showTree">显示树形选择器</button> -->
	<!-- <qian-tree ref="qiantree" lazy :selectParent="selectParent" :multiple="multiple" :range="productGategoryList" :foldAll="flod" idKey="value" rangeKey="label" @confirm="treeConfirm"
	 @cancel="treeCancel"></qian-tree> -->

	<view class="container">
		<Tree ref="qiantree" lazy :selectParent="selectParent" :multiple="multiple" :range="productGategoryList"
			:foldAll="flod" :modules="modules" :modulesName="modulesName" idKey="value" rangeKey="label" @initData="initData" </Tree>
	</view>

	<CustomAddBtn path="/pages/product/gategory/update?navTitle=新增商品分类"></CustomAddBtn>

</template>

<script>
	import CustomNavbar from "@/components/CustomNavbar.vue"
	import CustomAddBtn from "@/components/CustomAddBtn.vue"
	import Tree from '@/components/Tree.vue';
	import {
		productApi
	} from '@/utils/api.js'
	export default {
		components: {
			Tree,
			CustomNavbar,
			CustomAddBtn
		},
		data() {
			return {
				productGategoryList: [
					// {
					// 	label: '电子数码',
					// 	value: 1,
					// 	children: [
					// 		{
					// 			label: '手机',
					// 			value: 2,
					// 			children: [
					// 				{
					// 					label: '魅族',
					// 					value: 3,
					// 				}
					// 			]
					// 		},
					// 	]
					// },
				],
				multiple: true,
				selectParent: true,
				flod: true,
				modules: 'gategory',
				modulesName: '分类'
			}
		},
		onLoad() {
			this.initData()
		},
		methods: {
			initData() {
				productApi.getProductGategoryList().then(res => {
					if (res) {
						this.productGategoryList = res.data;
						this.showTree();
					}
				})
			},
			//显示树形结构
			showTree() {
				this.$refs.qiantree._show();
			},
		}
	}
</script>

<style>

</style>